<template>
  <div>
    <div class="list-header">
      <div>
        <i class="iconfont icon-wenjianjia" />
        <span>{{ fileTitle }}</span>
      </div>
      <i class="iconfont icon-shangchuanbeifen"></i>
    </div>
    <div class="file-list">
      <el-tree
        :data="data"
        accordion
        @node-click="handleNodeClick"
        :default-expand-all="true"
      >
      </el-tree>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.list-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  background-color: #e2e7f0;
  height: 32px;
  line-height: 32px;
  padding: 0 10px;
  span {
    margin-left: 5px;
  }
}
i {
  color: #899eae;
  font-size: 18px;
}
</style>
<script>
export default {
  name: "FileList",
  data() {
    return {};
  },
  props: {
    fileTitle: {
      type: String,
      default: "",
    },
    data: {
      type: Array,
      default: [
        {
          label: "附件材料",
          children: [
            {
              label: "XXXX文件",
            },
            {
              label: "XXXX文件",
            },
            {
              label: "XXXX文件",
            },
          ],
        },
      ],
    },
  },
  methods: {
    handleNodeClick() {
      //openfile
    },
  },
};
</script>